<template>
	<view class="navtab">
		<!-- navtab切换 -->
		<view class="navtab-top">
			<!-- 	<view class="navtab-item" @click="goToPage('/pagesA/sellCar/sellCar')">
					<view class="navtab-item-icon"><image src="../../static/navtab/navtab_sell.png" mode="aspectFit"></image></view>
					<view class="navtab-item-text">我要卖车</view>
				</view>
				<view class="navtab-item" @click="goToPage('/pagesA/buyCar/buyCar')">
					<view class="navtab-item-icon"><image src="../../static/navtab/navtab_buy.png" mode="aspectFit"></image></view>
					<view class="navtab-item-text">我要买车</view>
				</view>
				<view class="navtab-item" @click="goToPage('/pagesB/vehicleSelect/vehicleSelect')">
					<view class="navtab-item-icon"><image src="../../static/navtab/navtab_look.png" mode="aspectFit"></image></view>
					<view class="navtab-item-text">车况查询</view>
				</view>
				
				<view class="navtab-item" v-if="loanStatus" @click="goToPage('/pagesB/loans/loans')">
									<view class="navtab-item-icon"><image src="../../static/navtab/navtab_dai.png" mode="aspectFit"></image></view>
									<view class="navtab-item-text">我要贷款</view>
								</view> -->
		</view>
		<!-- 板块 -->
		<view class="bannerBk">
			<view @click="goToPage('/pagesA/buyCar/buyCar')">
				<image src="../../static/wymc.png" mode=""></image>
				<view class="textview">我要买车</view>
			</view>
			<view @click="goToPage('/pagesA/sellCar/sellCar')">
				<image src="../../static/wymc1.png" mode=""></image>
				<view class="textview">我要卖车</view>
			</view>
			<view  @click="chajiaTap">
				<image src="../../static/wycj.png" mode=""></image>
				<view class="textview">我要查价</view>
			</view>
			<view  @click="toMyCar">
				<image src="../../static/wdac.png" mode=""></image>
				<view class="textview">我的爱车</view>
			</view>
		</view>
		<!-- <view class="navtab-model">
			<view class="navtab-model-title navtab-model-sell mc"  @click="goToPage('/pagesA/buyCar/buyCar')">
				<view class="navtab-model-title-cont navtab-model-sell-contone">
					<view class="navtab-model-sell-cont-title mc1">我要买车</view>
					<view class="navtab-model-sell-cont-text mc1">比车商便宜10%</view>
				</view>
				
				<view class="mc11">
					<image src="../../static/wymc.png" mode="scaleToFill" style="width: 56rpx;height: 50rpx;"></image>
				</view>
			</view>
			<view class="navtab-model-title navtab-model-valuation mc22" @click="goToPage('/pagesA/sellCar/sellCar')">
				<view class="navtab-model-title-cont navtab-model-sell-conttwo ">
					<view class="navtab-model-sell-cont-title mc2">我要卖车</view>
					<view class="navtab-model-sell-cont-text mc2">最快三天卖出</view>
					
				</view>
				<view class="mc11 mc222">
					<image src="../../static/wymc1.png" mode="scaleToFill" style="width: 56rpx;height: 50rpx;"></image>
				</view>
			</view>
		</view>
		<view class="navtab-model">
			<view class="navtab-model-title navtab-model-sell cj" @click="chajiaTap">
				<view class="navtab-model-title-cont navtab-model-sell-contone">
					<view class="navtab-model-sell-cont-title cj1">我要查价</view>
					<view class="navtab-model-sell-cont-text cj1">二手车价精准查询</view>
				</view>
				<view class="mc11 mc33">
					<image src="../../static/wycj.png" mode="scaleToFill" style="width: 52rpx;height: 68rpx;"></image>
				</view>
			</view>
			<view class="navtab-model-title navtab-model-valuation ac" @click="toMyCar">
				<view class="navtab-model-title-cont navtab-model-sell-conttwo">
					<view class="navtab-model-sell-cont-title ac1">{{myCarValuation.carModel || '我的爱车'}}</view>
					<view class="navtab-model-sell-cont-text ac1">{{myCarValuation.caluation || '车辆价值动态管理'}}</view>
				</view>
				<view class="mc11 mc44">
					<image src="../../static/wdac.png" mode="scaleToFill"></image>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	
	export default {
		name:"navtab",
		props:{
			myCarValuation:{
				type: Object,
				default(){
					return {}
				}
			},
			token:{
				type: String,
				default: null
			},
			userInfo:{
				type: String,
				default: null
			},
			loanStatus:{
				type:Boolean,
				default:null
			}
		},
		data() {
			return {
				
			};
		},
		onShow() {
			
		},
		methods:{
			goToPage(url){
				if(this.token && this.userInfo){
					uni.navigateTo({url: url})
				}else{
					this.$u.toast('您的登录信息已过期，请先登录！');
					uni.navigateTo({url: '/pages/loginBtn/loginBtn'})
				}
			},
			chajiaTap(){
				if(this.token && this.userInfo){
					uni.navigateTo({url:'/pagesA/assessment/assessment'})
				}else{
					this.$u.toast('您的登录信息已过期，请先登录！');
					uni.navigateTo({url:'/pages/loginBtn/loginBtn'})
				}
			},
			toMyCar(){
				// 先判断在调用
				if(this.token && this.userInfo){
					if(this.myCarValuation.isIllegal){
						uni.navigateTo({url:'/pagesB/mineCar/mineCarList'})
					}else{
						uni.navigateTo({url:'/pagesB/mineCar/editCarInfo'})
					}
				}else{
					uni.navigateTo({
						url:'/pages/loginBtn/loginBtn'
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.bannerBk{
		display: flex;
		justify-content: space-between;
		text-align: center;
		
		image{
			width: 112rpx;
			height: 112rpx;
		}
			.textview{
				font-size: 28rpx;
				color: #2C2C2C;
				margin-top: 20rpx;
			}
	}
	.cj{
		border: 1px solid #7DE642 !important;
	}
	.cj1{
		color: #7DE642  !important;
	}
	.ac{
		border: 1px solid #42C7E6  !important;
	}
	.ac1{
		color:  #42C7E6  !important;
	}
	
	.navtab{
		padding:25rpx 32rpx 24rpx;
		
		box-sizing: border-box;
		// margin: $uni-widthspace $uni-widthspace 0px;
		// border-radius: 10rpx;
		background-color: $uni-bg-color;
		.navtab-top{
			margin-top: 80rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.navtab-item{
				flex: 1;
				text-align: center;
				.navtab-item-icon{
					image{
						width: 92rpx;
						height: 92rpx;
					}
				}
				.navtab-item-text{
					margin-top: 12rpx;
					font-size: 24rpx;
					color: #333;
				}
			}
		}
		.navtab-model{
			margin-top: 30rpx;
			box-sizing: border-box;
			display: flex;
			width: 100%;
			justify-content: space-between;
			align-items: center;
			.navtab-model-title{
				flex: 1;
				border-radius: 20rpx;
				height: 121rpx;
				// padding: 20rpx;
				box-sizing: border-box;
				display: flex;
				justify-content: space-between;
				align-items: center;
				position: relative;
				&.navtab-model-sell{
					// color: #fff;
					// background-color: #002A58;
					border: 2rpx solid #002A58;
					
				}
				&.navtab-model-valuation{
					// color: #002A58;
					margin-left: 20rpx;
					border: 2rpx solid #002A58;
					
				}
				image{
					width: 66rpx;
					height: 52rpx;
					margin-right: -1px;
					margin-top: 30rpx;
					margin-left: 30rpx;
				}
				.ywz_tip{
					position: absolute;
					width: auto;
					height: 48rpx;
					border-radius: 16rpx 16rpx 16rpx 0;
					background-color: #eb5348;
					line-height: 48rpx;
					color: #fff;
					right: -12rpx;
					top:-20rpx;
					padding: 0 6rpx;
				}
				.navtab-model-title-cont{
					font-size: 24rpx;
					.navtab-model-sell-cont-title{
						font-size: 34rpx;
						font-weight: bolder;
						margin-bottom: 6rpx;
						margin-left: 26rpx;
						max-width: 100px;
						 overflow: hidden;
						    text-overflow: ellipsis;
						    white-space: nowrap;
					}
					.navtab-model-sell-cont-text{
						font-size: 20rpx;
						font-weight: bolder;
						margin-left: 26rpx;
					}
					
				}
			}
		}
	}

</style>
